<template>
	<view class="content dis">
		<!-- <scroll-view style="width: 25%;height: 100vh;" scroll-y="true" class="scroll-Y">
			<view v-for="(item,index) in fic" :key="index" class="wid100 dis disAl disJuC foSi30" @click="xuanze(index)"
				:style="ficIndex == index?'height: 107rpx;background-color: #fff;':'height: 107rpx;'">{{item.name}}</view>
			<view style="height: 150rpx;"></view>
		</scroll-view>
		<scroll-view style="width: 75%;height: 100vh;" scroll-y="true" class="bacFFF " @scrolltolower="lower">
			<view v-for="(item,index) in list" :key="index" class="wid90 mar box dis disAl mar-top30 borRad20">
				<image :src="url+item.coverimg" class="borRad20" style="width: 193rpx;height: 210rpx;"></image>
				<view class="mar-left20" style="width: 55%;">
					<view class="foSi25" style="font-weight: 600;">{{item.name}}</view>
					<view class="foSi20 mar-top10" style="color: #908E8E;">
						<view>用途：{{item.useto}}</view>
						<view>规格：{{item.spec}}</view>
						<view>库存：{{item.stock}}</view>
					</view>
					<view class="dis disAl disJuB hei60">
						<view style="color: #ff0000;">￥{{item.price}}</view>
						<view class="dis disAl">
							<image @click="jian(index)" src="../../static/purchase/jian.png" style="width: 32rpx;height: 32rpx;"></image>
							<view style="width: 60rpx;height: 32rpx;background-color: #E5E5E5;margin: 0 5rpx;border-radius: 5rpx;"
								class="foSi20 dis disAl disJuC" >{{item.num}}</view>
							<image @click="jia(index)" src="../../static/purchase/jia.png" style="width: 32rpx;height: 32rpx;"></image>
						</view>
					</view>
				</view>
			</view>
			<view style="height: 150rpx;"></view>
		</scroll-view>
		<view class="wid100 poAbs bacFFF" style="bottom: 0;height: 115rpx;">
			<view class="wid90 mar hei100 dis disAl disJuB">
				<view style="height: 70rpx;width: 76rpx;" class="poRel">
					<image src="../../static/purchase/gouwuche.png" class="wh100"></image>
					<view v-if="prolist.length>0" style="width: 25rpx;height: 25rpx;background-color: #ff0000;right: -10rpx;top: 0;font-size: 15rpx;" 
						class="dis disAl disJuC poAbs borRad50 coFFF">{{prolist.length}}</view>
				</view>
				<view class="coFFF borRad10 dis disAl disJuC foSi30 hei60" @click="tiaozhuan('/pages/purchase/confirmAnOrder?prolist='+JSON.stringify(prolist))"
					style="width: 180rpx;background-color: #1262DB;">立即购买</view>
			</view>
		</view> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				url: this.global.url,
				last_page: 0,
				page: 0,
				fic: [],
				list: [],
				ficIndex: 0,
				prolist: [],
				jianTrue: true,
				jiaTrue: true
				
			}
		},
		onLoad() {
			this.getfic()
		},
		methods: {
			jian(index){
				if(this.jianTrue){
					this.jianTrue = false
					if(this.prolist){
						for (var i=0; i<this.prolist.length; i++) {
							if(this.prolist[i].id == this.list[index].id){
								if(this.list[index].num > 1){
									this.prolist[i].num -= 1
								}else{
									this.prolist.splice(i, 1);
								}
								this.list[index].num -= 1
							}
						}
					}
					this.jianTrue = true
				}
			},
			jia(index){
				if(this.jiaTrue){
					this.jiaTrue = false
					this.list[index].num += 1
					if(this.list[index].num == 1){
						this.prolist = this.prolist.concat({
							id: this.list[index].id,
							num: this.list[index].num
						})
					}else{
						for (var i=0; i<this.prolist.length; i++) {
							if(this.prolist[i].id == this.list[index].id){
								this.prolist[i].num += 1
							}
						}
					}
					this.jiaTrue = true
					console.log(this.list[index])
				}
			},
			xuanze(index){
				this.ficIndex = index
				this.page = 0
				this.getlist()
			},
			lower: function(e) {
				if(this.last_page != this.page+1){
					this.page++
				}
			},
			tiaozhuan(url){
				uni.navigateTo({
					url: url
				});
			},
			getfic(){
				var that = this
				uni.request({
				    url: that.global.url + 'api/product/getfic',
				    method: "POST",
					header: {
						'token': uni.getStorageSync('token')
					},
				    data: {},
				    success(res) {
				        let result = res.data
				        if(result.code == 1){
							that.fic = result.data
							that.getlist()
						}else{
				           uni.showToast({
				           	title: result.msg,
				           	icon: 'error'
				           })
				        }
				       
				    }
				})
			},
			getlist(){
				var that = this
				uni.request({
				    url: that.global.url + 'api/product/getlist',
				    method: "POST",
					header: {
						'token': uni.getStorageSync('token')
					},
				    data: {
						// keywords: this.inputValue,
						fic: this.fic[this.ficIndex].id,
						page: this.page
					},
				    success(res) {
				        let result = res.data
				        if(result.code == 1){
							that.last_page = result.data.last_page
							var arr = result.data.data
							for(var j=0; j<arr.length; j++) {
								var a = 0
								for(var i=0; i<that.prolist.length; i++) {
									if(that.prolist[i].id == arr[j].id){
										a = 1
										arr[j].num = that.prolist[i].num
									}
								}
								if(a == 0){
									arr[j].num = 0
								}
							}
							if(that.page == 0){
								that.list = arr
							}else{
								that.list = that.list.concat(arr)
							}
							
						}else{
				           uni.showToast({
				           	title: result.msg,
				           	icon: 'error'
				           })
				        }
				       
				    }
				})
			},
			
		}
	}
</script>

<style>
	.content {
		height: 100vh;
		background-color: #F0F0F0;
	}
	::-webkit-scrollbar {
		display: none;
	}
</style>
